<template>
  <el-table :data="data" style="width: 100%" height="calc(100% - 2px)">
    <el-table-column v-for="item in cfg" :prop="item.prop" :label="item.label" :key="item.prop"
                     :width="item.width||'auto'" :align="item.align||'left'"></el-table-column>
  </el-table>
</template>

<script>
export default {
  name: "SmallTable",
  props: ['data', 'cfg'],
  data() {
    return {}
  },
  methods: {}
}
</script>

<style scoped lang="scss">
.el-table {
  background-color: transparent !important;

  /deep/ .el-table__expanded-cell, /deep/ tr, /deep/ td, /deep/ th {
    background-color: transparent !important;
    padding: 4px 0 !important;
    color: #999 !important;
  }

  /deep/ th {
    color: var(--font-green-color) !important;
  }

  /deep/ tr:hover td {
    background-color: rgba(255, 255, 255, .1) !important;
  }

  /deep/ tbody tr:nth-child(2n+1) {
    background-color: rgba(255, 255, 255, .03) !important;
  }

  /deep/ td.el-table__cell,
  /deep/ th.el-table__cell.is-leaf {
    border-bottom: none!important;
  }
}

.el-table::before {
  display: none !important;
}
</style>
